<div class="row">
	<div class="col-xs-12">
		<div class="box">
			<div class="box-header">
				<h3 class="box-title">订单管理</h3>

				<div class="box-tools">
					<div class="input-group input-group-sm" style="width: 350px;">
						<input type="text" name="table_search" id="searchNameId"
							class="form-control pull-right" placeholder="查询前请先登录">

						<div class="input-group-btn">
<!--							<button type="button" class="btn btn-default btn-search">-->
<!--                                <i class="fa fa-search"></i>-->
<!--							</button>-->
<!--							<button type="button" class="btn btn-default btn-update">修改</button>-->
						</div>
					</div>
				</div>
			</div>
			<!-- /.box-header -->
			<div class="box-body table-responsive no-padding">
				<table class="table table-hover">
					<thead>
						<tr>
							<th>订单号</th>
							<th>商品ID</th>
							<th>商品名称</th>
							<th>价格</th>
							<th>地址</th>
							<th>收货人</th>
							<th>状态</th>
							<th>手机号</th>
							<th>订单数量</th>
							<th>创建时间</th>
						</tr>
					</thead>
					<tbody id="tbodyId"></tbody>
				</table>
			</div>
			<div id="pageId" class="box-footer clearfix">
			</div>
			<!-- /.box-body -->
		</div>
		<!-- /.box -->
	</div>
</div>
<script type="text/javascript">
   $(document).ready(function(){
	   $("#pageId").load("doPageUI",function(){
		   doGetObjects();
	   });
	   $(".input-group-btn")
	   .on("click",".btn-search",doQueryObjects)
	   .on("click",".btn-update",doLoadEditUI);

   });

   function doLoadEditUI(){
	   //1.判定点击的对象
	   var title;
	 if($(this).hasClass("btn-update")){
		   title="修改订单";
		   var id=doGetCheckedId();
		   console.log("id="+id)
		   if(!id){
			  alert("请先选择");
			  return;
		   }
		   //基于id进行查询并加载编辑页面
		   doFindObjectById(id,title);
	   }
   }
   function doFindObjectById(id,title){
	   //1.params
	   var params={"id":id};
	   //2.url
	   var url="order/doFindObjectById";
	   //3.ajax request
	   $.getJSON(url,params,function(result){//JsonResult
		   if(result.state==1){
			  $("#mainContentId").data("rowData",result.data);
	          doLoadPage(title);
		   }else{
			  alert(result.message);
		   }
	   });
   }

   function doGetCheckedId(){
	 return $("tbody input[name='radioId']:checked").val();
   }
   // function doLoadPage(title){
	//    var url="order/order_edit"
	//    $("#mainContentId").load(url,function(){
	// 	   $(".box-title").html(title);
	//    })
   // }


   //处理查询按钮事件
   function doQueryObjects(){
	   $("#pageId").data("pageCurrent",1);
	   doGetObjects();
   }
   //页面加载完成异步加载当前页数据
   function doGetObjects(){
	   var url="http://www.nb.com/cart/show";
	   var pageCurrent=$("#pageId").data("pageCurrent");
	   if(!pageCurrent)pageCurrent=1;
	   var params={"pageCurrent":pageCurrent}
	   params.name=$("#searchNameId").val().trim();
	   console.log(params);
	   $.getJSON(url,params,function(result){
		   console.log(result);
		   doHandleResponseResult(result);
	   });
   }
   function doHandleResponseResult(result){
	   if(result.state==1){
		  doSetTableBodyRows(result.data.records);
		  doSetPagination(result.data);
		}else{
		  alert(result.message);
	   }
   }
   //通过服务端返回的数据初始化页面
   function doSetTableBodyRows(data){
	  //1.获取tbody对象，并清空内容
	  var tBody=$("#tbodyId");
	  tBody.empty();
	  //2.迭代data内容将数据追加到tbody中
	  for(var i in data){
		  var tr=$("<tr></tr>");
		  tr.data("rowData",data[i]);
		  var tds=doCreateTds(data[i]);
		  tr.append(tds);
		  tBody.append(tr);
	  }
   }
   function doCreateTds(row){
	   console.log(row);
	   var tds="<td>"+row.id+"</td>"+
	     "<td>"+row.itemId+"</td>"+
	     "<td>"+row.itemTitle+"</td>"+
	 "<td>"+(row.itemPrice/100)+"</td>"+
			   "<td>"+'山西省太原市小店区'+"</td>"+
			   "<td>"+'郭建峰'+"</td>"+
	     "<td>"+'已下单请等待付款'+"</td>"+
	     "<td>"+'1580341444'+"</td>"+
			   "<td>"+row.num+"</td>"+
	     "<td>"+new Date(row.created).toLocaleString()+"</td>";
       return tds;
   }
</script>




